import { Button, Dropdown, Tag, Space } from 'antd'
import { TableDropdown } from '@ant-design/pro-components'

const Base = async () => {
    return {
        pageIndex: 1,
        pageSize: 100,
        optionsBtn: () => ([
            <Button
                key="button"
                onClick={() => { actionRef.current.reload() }}
                type="primary"
            >
                多选
            </Button>,
            <Dropdown
                key="menu"
                menu={{
                    items: [
                        { label: '1st item', key: '1' },
                        { label: '2nd item', key: '2' },
                        { label: '3rd item', key: '3' },
                    ],
                }}
            >
                <Button>操作 </Button>
            </Dropdown>,
        ]),
        columns: [
            {
                dataIndex: 'index',
                valueType: 'indexBorder',
                width: 48,
                fixed: 'left',
            },
            {
                title: '进度',
                dataIndex: 'progress',
                valueType: e => ({ type: 'progress', status: e.state !== 'error' ? 'active' : 'exception' }),
                width: 240,
            },
            {
                title: '标题',
                dataIndex: 'title',
                copyable: true,
                ellipsis: true,
                tooltip: '标题过长会自动收缩',
                width: 500
            },
            {
                title: '状态',
                dataIndex: 'state',
                filters: true,
                onFilter: true,
                valueType: 'select',
                valueEnum: {
                    default: { text: '待领取...', status: 'default' },
                    processing: { text: '解决中...', status: 'processing', disabled: true },
                    success: { text: '已解决!', status: 'success' },
                    warning: { text: '警报中!', status: 'warning' },
                    error: { text: '无法解决!', status: 'error' },
                },
                width: 160
            },
            {
                title: '标签',
                dataIndex: 'labels',
                search: false,
                renderFormItem: (_, { defaultRender }) => { return defaultRender(_) },
                render: (_, record) => (
                    <Space>
                        {record.labels.map(({ name, color }) => <Tag color={color} key={name}>{name}</Tag>)}
                    </Space>
                ),
                width: 160
            },
            {
                title: '创建时间',
                key: 'showTime',
                dataIndex: 'created_at',
                valueType: 'date',
                sorter: true,
                hideInSearch: true,
                width: 160
            },
            {
                title: '创建时间',
                dataIndex: 'created_at',
                valueType: 'dateRange',
                hideInTable: true,
                search: { transform: (value) => ({ startTime: value[0], endTime: value[1] }) },
            },
            {
                title: '操作',
                valueType: 'option',
                key: 'option',
                disable: true,
                fixed: 'right',
                width: 300,
                render: () => [
                    <Button type='link' key="editable">编辑</Button>,
                    <TableDropdown
                        key="actionGroup"
                        menus={[
                            { key: 'copy', name: '复制' },
                            { key: 'delete', name: '删除' },
                        ]}
                    />,
                ],
            },
        ],
    }
};

export default Base;